<style lang="scss">
* {
  margin: 0;
  padding: 0;
}

li {
  list-style: none;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0; // 清除默认边距
  background-color: #161622;
}

ul,
ol {
  list-style: none;
}

#app {
  width: 100%;
  height: 100%;
}

.container {
  width: 100%;
  height: 100%;
}
</style>
<template>
  <div class="container">
    <router-view></router-view>
    <TabBar v-if="!isVideoPath && $route.path !== '/user/fans' && $route.path !== '/user/follows'"></TabBar>
    <LoginModal></LoginModal>
    <RegisterModal></RegisterModal>
    <ForgotPasswordModal></ForgotPasswordModal>
  </div>
</template>
<script setup>
import { useRoute } from 'vue-router';
import TabBar from './components/common/TabBar.vue';
import LoginModal from './components/login/LoginModal.vue';
import RegisterModal from './components/login/RegisterModal.vue';
import ForgotPasswordModal from './components/login/ForgotPasswordModal.vue';
// // 获取当前路由
const route = useRoute();

// 1. 定义不需要显示TabBar的路径（集中管理）
const excludePaths = [
  '/video', // 所有包含/video的路径（如/video/123）
  '/user/fans', // 粉丝列表页
  '/user/follows' // 关注列表页
];

// 2. 计算属性：判断当前路径是否需要显示TabBar
const shouldShowTabBar = computed(() => {
  // 当前路径是否不在排除列表中（即需要显示TabBar）
  return !excludePaths.some(path => route.path.includes(path));
});
</script>